<template>
  <div class="app-container">
    <input v-model="inputVal" type="text" class="form-control" placeholder="请输入" />
    <button @click="handleSubmit">点我</button>
    <br />
    <br />
    <h2>你好-我叫{{ obj.name }}</h2>
    <p>年龄{{ obj.age }}</p>
    <p>喜欢{{ obj.like }}</p>
  </div>
</template>

<script setup>
import { ref, reactive } from 'vue';

const inputVal = ref('');
const obj =reactive({
    name:'wht',
    age:'18',
    like:'bhx'
}) 
const emits = defineEmits(['handleAdd'])


const handleSubmit = ()=>{
    emits('handleAdd',inputVal.value)
    inputVal.value=''
}
defineExpose({
    inputVal,
    obj
})


</script>

<style lang="scss" scoped>
</style>